<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
		<title>后台登录</title>
		<link rel="stylesheet" type="text/css" href="static/admin/layui/css/layui.css" />
		<link rel="stylesheet" type="text/css" href="static/admin/css/login.css" />
		<script>
			//防止页面后退
			history.pushState(null, null, document.URL);
			window.addEventListener('popstate', function () {
				history.pushState(null, null, document.URL);
			});
		</script>
	</head>
	<body>
		<div class="m-login-bg">
			<div class="m-login">
				<h3>后台系统登录</h3>
				<div class="m-login-warp">
					<form class="layui-form">
						<div class="layui-form-item">
							<input type="text" name="userName" required lay-verify="required" placeholder="用户名" autocomplete="off" class="layui-input">
						</div>
						<div class="layui-form-item">
							<input type="password" name="password" required lay-verify="required" placeholder="密码" autocomplete="off" class="layui-input">
						</div>
						<!--<div class="layui-form-item">-->
							<!--<div class="layui-inline">-->
								<!--<input type="text" name="verity" required lay-verify="required" placeholder="验证码" autocomplete="off" class="layui-input">-->
							<!--</div>-->
							<!--<div class="layui-inline">-->
								<!--<img class="verifyImg" onclick="this.src=this.src+'?c='+Math.random();" src="../../static/admin/images/login/yzm.jpg" />-->
							<!--</div>-->
						<!--</div>-->
						<div class="layui-form-item m-login-btn">
							<div class="layui-inline">
								<button class="layui-btn layui-btn-normal" lay-submit lay-filter="login">登录</button>
							</div>
							<div class="layui-inline">
								<button type="reset" class="layui-btn layui-btn-primary">取消</button>
							</div>
						</div>
					</form>
				</div>
				<p class="copyright">Copyright 2015-2016 by MaYi</p>
			</div>
		</div>
		<script src="static/admin/layui/layui.js" type="text/javascript" charset="utf-8"></script>
		<script src="static/admin/js/baseUrl.js"></script>
		<script>
			layui.use(['form', 'layedit', 'laydate',  'jquery'], function() {
				var form = layui.form;
				var	layer = layui.layer;
				var $ = layui.jquery;

				//自定义验证规则
				form.verify({
					// title: function(value) {
					// 	if(value.length < 5) {
					// 		return '标题至少得5个字符啊';
					// 	}
					// },
					// password: [/(.+){6,12}$/, '密码必须6到12位'],
					// verity: [/(.+){6}$/, '验证码必须是6位'],

				});
				//监听提交
				form.on('submit(login)', function(data) {
					var loading = layer.load(1, {shade: [0.3, '#000']});
					$.ajax({
						url: baseUrl + '/login',
						data: JSON.stringify(data.field),
						type: 'post',
						dataType: 'json',
						contentType: 'application/json',
						crossDomain: true,                 //加这二行支持ajax跨域，允许跨域
						xhrFields: {withCredentials: true},//加这二行支持ajax跨域，携带凭证
						success: function (data) {
							// console.log(data);
							if(data.ret === 200) {
								sessionStorage.setItem('userName',data.data.userName);
								sessionStorage.setItem('userId',data.data.id);
								location.href = 'index.html'
							}else {
								layer.alert(data.msg,{icon: 0})
							}
						},
						error: function () {
							layer.msg('网络发生故障，请稍后再试', {icon: 0, time: 1000});
						},
						complete: function () {
							layer.close(loading);
						}
					});
					return false;
				});

			});
		</script>
	</body>

</html>
